<template>
	<div class="rule w944">
		<alert ref="alert"></alert>
		<div class="label_top">
			<p><i class="line"></i>学分规则</p>
		</div>
		<div class="label_table">
			<el-table ref="multipleTable" :data="tableData" border @selection-change="handleSelectionChange">
				<el-table-column prop="sort" label="编号" width="60"></el-table-column>
				<el-table-column prop="name" label="学分任务"></el-table-column>
				<el-table-column label="学分数">
					<template slot-scope="scope">
						<input type="tel" v-model="scope.row.credit" class="score" @blur="updateScore(scope.row)"/>
					</template>
				</el-table-column>
				<el-table-column label="每日上限">
					<template slot-scope="scope">
						<span v-if="scope.row.sort==1">一次性</span>
						<span v-else-if="scope.row.sort==2">1</span>
						<span v-else-if="scope.row.sort==3||scope.row.sort==4">无</span>
						<input v-else v-model="scope.row.num" class="score" @blur="updateScore(scope.row)"/>
					</template>
				</el-table-column>
				<el-table-column label="状态">
					<template slot-scope="scope">
						<el-switch class="switchStyle" v-model="scope.row.status" active-color="#44cef6" inactive-color="#999" active-text="开启" inactive-text="关闭" :active-value="1" :inactive-value="2" @change="changeSwitch(scope.row)"></el-switch>
					</template>
				</el-table-column>
			</el-table>
			<div class="fenyeMargin">
				<div class="pag_block">
					<el-pagination @current-change="handleCurrentChange" :current-page="currentpage" :page-size="pagesize" layout="prev, pager, next" :total="total"></el-pagination>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
	import alert from '../../components/Alert.vue';
	export default {
		data() {
			return {
				rule:'',
				statuswitch:'',
				tableData:[],
				pagesize: 15,
		        currentpage: 1,
		        total: 1
			}
		},
		methods: {
			getTableList() {
				this.$ajax({
					url: this.$root.jifuUrl + "/getCreditRulePage?"+'rootcompanyid=1'+'&page='+this.currentpage+'&num='+this.pagesize,
					method: 'GET',
					data: {},
					success: res => {
						if(res.data.code == 200) {
							this.tableData = res.data.data.list;
							this.total=res.data.data.pageParam.items;
						}
					}
				});
			},
			updateScore(row){
				console.log(row);
				let detail = {
					id:row.id,
					credit:row.credit,
					num:row.num,
					rootcompanyid:1
				};
				this.$ajax({
					url: this.$root.jifuUrl + "/updateCreditRule",
					method: 'POST',
					data: this.qs.stringify(detail),
					success: res => {
						if(res.data.code == 200) {
//							this.$rootFunction().addResSuccess();
						}else{
							this.failText = res.data.message;
							this.$rootFunction().deleteResFail();
						}
					}
				});
			},
			handleSelectionChange(val) {
				this.multipleSelection = val;
			},
			changeSwitch(row){
				if(row.status == 1){
					let s={
						id:row.id,
						rootcompanyid:1,
						status:1
					};
					this.$ajax({ 
						url: this.$root.jifuUrl + "/updateCreditRuleStatus",
						method: 'POST',
						data: this.qs.stringify(s),
						success: res => {
							if(res.data.code == 200) {
								console.log('当前用户状态为',row.status);
							}
						}
					});
				}else if(row.status == 2){
					let s={
						id:row.id,
						rootcompanyid:1,
						status:2
					};
					this.$ajax({ 
						url: this.$root.jifuUrl + "/updateCreditRuleStatus",
						method: 'POST',
						data: this.qs.stringify(s),
						success: res => {
							if(res.data.code == 200) {
								console.log('当前用户状态为',row.status);
							}
						}
					});
				}
			},
			handleCurrentChange(value) {
				this.currentpage = value;
				this.getTableList();
			},
		},
		components: {
			alert
		},
		mounted: function() {
			this.getTableList();
			this.rule = this.$root.huasan.rule;
		}
	}
</script>

<style>
	.rule .el-table__row .cell .score{width: 60px;height: 28px;border: 1px solid #ccc;border-radius: 3px;color: #333;text-align: center;}
	.rule .label_table .switchStyle span.el-switch__label--left{left: 7px;}
	.rule .label_table .switchStyle span.el-switch__label--right{left: -17px;}
</style>